<template>
	<view class="height-100">
		<PageHead></PageHead>
		<view class="padding-15 width-per-100 fs-white flex flex-column flex-nowrap">
			<Acard bgFilter>
				<view class="flex flex-column flex-nowrap">
					<text class="fs-50 mb-15">标题：{{ displayArticle.title }}</text>
					<text class="fs-lightblue fs-20 mb-5">发布时间：{{ $u.timeFormat(displayArticle.creationTime * 1,'yyyy年mm月dd日') }}</text>
					<text class="fs-28 mb-10">文章内容：</text>
					<u-parse :content="article"></u-parse>
				</view>
			</Acard>
			
			<!-- 评论区 -->
			<CommentSection isArticle></CommentSection>
		</view>

		<!-- 粒子效果背景 -->
		<ParticleBackground></ParticleBackground>
	</view>
</template>

<script>
import { mapState } from 'vuex';
import { marked } from 'marked'
export default {
	name: 'ArticleDetail',
	data() {
		return {};
	},
	computed: {
		...mapState('article', ['displayArticle']),
		article(){
			return marked(this.displayArticle.detail);
		}
	},
	methods: {

	}
};
</script>

<style scoped lang="scss">

</style>
